<template>
	<view class="uni-page">
		<uni-table border stripe emptyText="暂无更多数据">
			<!-- 表头行 -->
			<uni-tr>
				<uni-th align="center">提交时间</uni-th>
				<uni-th align="center">Token</uni-th>
				<uni-th align="left">结算状态</uni-th>
				<uni-th align="left">结算详情</uni-th>
			</uni-tr>
			<!-- 表格数据行 -->
			<uni-tr v-for="item in items" :key="item.id">
				<uni-td>{{item.createtime}}</uni-td>
				<uni-td>
					<button size="mini" type="primary" @click="showToken(item)">查看</button>
				</uni-td>
				<uni-td>已结算</uni-td>
				<uni-td>

					<button size="mini" type="primary" @click="showPopup(item)">查看</button>

				</uni-td>
			</uni-tr>

		</uni-table>
		<uni-popup ref="show_popup" background-color="#fff">
			<view class="popup-content">
				<text class="text" v-for="od in odkdshow">
					{{od}}
				</text>
			</view>
		</uni-popup>
		<view class="uni-pagination-box"><uni-pagination show-icon :page-size="pageSize" :current="page" :total="total"
				@change="PageChange" /></view>
	</view>
</template>

<script setup>
	import {
		onMounted,
		ref
	} from 'vue';
	import {
		getOrderSettlementAPI
	} from '../../apis/order_settlement';
	const total = ref(0)
	const page = ref(1)
	const pageSize = ref(10)
	const show_popup = ref(null)
	const items = ref([])
	const odkdshow = ref([])
	const PageChange = ((e) => {
		page.value = e.current

		// getList({
		// 	status: status.value,
		// 	page: page.value,
		// 	hangshu: pageSize.value
		// })
	})

	onMounted(() => {
		getList()
	})
	const showPopup = (item) => {
		show_popup.value.open('top')
		odkdshow.value = item.odkdshow
	}
	const showToken = (item) => {
		show_popup.value.open('top')
		odkdshow.value = item.tokenlist
	}
	const getList = async () => {
		// 请求数据
		let {
			data
		} = await getOrderSettlementAPI();
		items.value = data.ddjslist
	}
</script>

<style>
	.uni-page {
		padding: 20upx;
	}
</style>